<template>
  <div>
    <div class="hello">
      <div class="r">
        <el-tag>{{ info }}</el-tag>
      </div>
    </div>
    <div>
      <p>子组件来修改父组件中的默认值</p>
      <el-button type="primary" @click="editFather">修改父组件</el-button>
    </div>
  </div>
</template>
   
  <script setup>
import { ElMessage } from "element-plus";
import Child from "./son-father.vue";
import { ref, toRefs, defineProps, defineEmits } from "vue";

const props = defineProps({
  info: String,
});

const { info } = toRefs(props);

const editFather = () => {
  emit("changeInput", "我是子组件");
};

const editval = () => {
  ElMessage({
    message: "触发了",
    type: "warning",
  });
};

const emit = defineEmits(["changeInput"]);

//暴露给父组件调用
defineExpose({
  editval,
});
</script>
   
  <style scoped>
</style>